<template>
  <el-dialog
    :title="`${type === 1 ? '入库记录' : '出库记录'}`"
    :visible.sync="dialogVisible"
    width="1000px"
    @close="handleClose"
  >
    <div></div>
    <el-table :data="tableData" border :max-height="400">
      <el-table-column label="序号" width="50px" type="index"></el-table-column>
      <el-table-column label="经手人" prop="createByName" align="center"></el-table-column>
      <el-table-column label="入库时间" v-if="type === 1" prop="createTime" align="center"></el-table-column>
      <el-table-column label="入库数量" v-if="type === 1" prop="operateNum" align="center"></el-table-column>
      <el-table-column label="生产批次号" v-if="type === 1" prop="batchCode" align="center"></el-table-column>
      <el-table-column label="出库时间" width="170px" v-if="type === 2" prop="createTime" align="center"></el-table-column>
      <el-table-column label="出库数量" v-if="type === 2" prop="operateNum" align="center"></el-table-column>
      <el-table-column label="收货人" v-if="type === 2" prop="consignee" align="center"></el-table-column>
      <el-table-column label="电子签名快照" v-if="type === 2" prop="signImage" align="center"></el-table-column>
      <el-table-column label="备注" prop="remark" align="center" show-overflow-tooltip></el-table-column>
    </el-table>
    <div class="pagination">
      <el-pagination
        background
        :page-size="pageVO.pageSize"
        :current-page.sync="pageVO.pageNo"
        :total="pageVO.total"
        layout="total, sizes, prev, pager, next, jumper"
        :page-sizes="[10, 20, 30, 50, 100]"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      />
    </div>
  </el-dialog>
</template>
<script>
import { getInventoryLogList } from '@/api/inventory';
export default {
  data() {
    return {
      type: 1,
      row: null,
      tableData: [],
      total: 0,
      pageVO: {
        pageNo: 1,
        pageSize: 10,
      },
      dialogVisible: false,
    };
  },
  methods: {
    handleClose() {
      this.dialogVisible = false;
      this.tableData = [];
      this.pageVO = {
        pageNo: 1,
        pageSize: 10,
      };
    },
    openHandle(type, row) {
      this.type = type;
      this.row = row;
      this.dialogVisible = true;
      this.getTableData();
    },
    handleSizeChange(size) {
      this.pageVO.pageNo = 1;
      this.pageVO.pageSize = size;
      this.getTableData();
    },
    handleCurrentChange(num) {
      this.pageVO.pageNo = num;
      this.getTableData();
    },
    getTableData() {
      getInventoryLogList({
        invId: this.row.id,
        type: this.type,
        ...this.pageVO,
      }).then(res => {
        const { data, total } = res.data || {};
        this.tableData = data || [];
        this.pageVO.total = total;
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.pagination {
  text-align: right;
  padding: 10px 0;
}
</style>
